import {
  MenuType,
  UserStatus,
  menuTypeOptions,
  userStatusOptionns,
} from '../lib/enums';
import React, { memo } from 'react';

import { Tag } from 'antd';
import variables from '../lib/themeVariables';

const createEnumTag =
  (options, config) =>
  ({ value, ...props }) => {
    const color = config[value];
    return (
      <Tag color={color} {...props}>
        {options.getLabel(value)}
      </Tag>
    );
  };

const EnumTag = {
  MenuTag: memo(
    createEnumTag(menuTypeOptions, {
      [MenuType.BUTTON]: variables.primaryColor,
      [MenuType.MENU]: variables.successColor,
      [MenuType.OTHER]: variables.warningColor,
    }),
  ),
  UserTag: memo(
    createEnumTag(userStatusOptionns, {
      [UserStatus.ENABLED]: variables.successColor,
      [UserStatus.DISABLED]: variables.errorColor,
    }),
  ),
};

export default EnumTag;
